<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<%@include file= "/WEB-INF/pages/base/commImportPage.jsp" %><html>
  <head>
    <title>参数项管理</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
      <link style="">
      <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/ztree/JQueryzTreev3.5/css/zTreeStyle/zTreeStyle.css">
     <%--<script type="text/javascript" src="${pageContext.request.contextPath}/jquery/jquery-1.11.2.js"></script>--%>
      <script type="text/javascript"src="${pageContext.request.contextPath}/ztree/JQueryzTreev3.5/js/jquery-1.4.4.min.js"></script>
      <script type="text/javascript" src="${pageContext.request.contextPath}/ztree/JQueryzTreev3.5/js/jquery.ztree.all-3.5.js"></script>

      <script>
          function onClickTrade(e, treeId, treeNode) {
              alert(treeNode.id + treeNode.name);
          };
          var setting = {
              //复选框显示
              check:{
                  enable: true,
                  chkStyle: "radio",
                  radioType: "all"
              },
              data : {
                  simpleData : {
                      enable : true,//简单的数据
                      idkey : "id",//本身的id
                      pidkey : "pId",//父节点
                      rootpid : null
                  }
              },
              view : {
                  selectedMulti : false,
                  showLine : true,//是否显示连接线
                  showIcon : true,//是否显示图标
                  nameIsHTML : true,//nodes是否可以使用html标签
                  showTitle : true
              },
              async : {
                  enable : true,
                  url : "${pageContext.request.contextPath}/codeController/selectList.json",
                  autoParam : [ "id" ]
              }
              //点击后的触发事件
              ,
              callback : {
                  onClick : onClickTrade
              }
          };
          //加载ztree
          function onloadZTree(){
              var ztreeNodes;
              $.ajax( {
                  async : true, //是否异步
                  cache : false, //是否使用缓存
                  type : 'get', //请求方式,post
                  dataType : "json", //数据传输格式
                  url : "${pageContext.request.contextPath}/codeController/selectList.json", //请求链接
                  error : function() {
                      alert("加载失败");
                  },
                  success : function(data) {
                      ztreeNodes = data.znodes;
                      $.fn.zTree.init($( "#treeDemo"), setting, ztreeNodes);
                      zTree_Menu = $.fn.zTree.getZTreeObj("treeDemo" );
                  }
              });
          }

          //初始化操作
          $(document).ready( function(){
              onloadZTree();
              $("#add").click(function(){
                  var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
                  var nodes = treeObj.getCheckedNodes(true);
                  if(null!=nodes&&""!=nodes){
                      alert(nodes);
                      var id=nodes[0].id;
                      var idPath=nodes[0].idPath;
                      $("#parentId").val(id);
                      $("#idPath").val(idPath);
                  }
                  $("#updateDiv").hide();
                  $("#addDiv").show();
                  $("#searchDiv").hide();
              });
              $("#addBtn").click(function(){
                  var formParam = $("#addFor").serialize();
                  $.ajax({
                      url:"${pageContext.request.contextPath}/codeController/addSysBaseCode.json",
                      method:"post",
                      data:formParam,
                      dataType:"json",
                      success:function(d){
                          if(null!= d.result&&1=== d.result){
                              alert("增加成功!");
                              onloadZTree();
                          }
                      }
                  });
              });
              $("#delete").click(function(){
                  var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
                  var nodes = treeObj.getCheckedNodes(true);
                  var id=nodes[0].idPath;
                  if(null==id||""===id){
                      alert("请选中要删除的节点");
                  }else{
                      $.ajax({
                          url:"${pageContext.request.contextPath}/codeController/deleteSysBaseCode.json",
                          method:"post",
                          data:{"idPath":id},
                          dataType:"json",
                          success:function(d){
                              if(null!= d.result&&d.result>0){
                                  alert("删除成功!");
                                  onloadZTree();
                              }
                          }
                      });
                  }
              });
              $("#update").click(function(){
                  $("#updateDiv").show();
                  $("#addDiv").hide();
                  $("#searchDiv").hide();
                  var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
                  var nodes = treeObj.getCheckedNodes(true);
                  if(null!=nodes&&""!=nodes){
                      var id=nodes[0].id;
                      $("#updateId").val(id);
                  }else{
                      alert("请选择要修改的节点");
                  }
              });
              $("#updateBtn").click(function(){
                  var formParam = $("#updateFor").serialize();
                  $.ajax({
                      url:"${pageContext.request.contextPath}/codeController/updateSysBaseCode.json",
                      method:"post",
                      data:formParam,
                      dataType:"json",
                      success:function(d){
                          if(null!= d.result&&1==d.result){
                              alert("更改成功!");
                              onloadZTree();
                          }
                      }
                  });
              });
              $("#search").click(function(){
                  var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
                  var nodes = treeObj.getCheckedNodes(true);
                  if(null!=nodes&&""!=nodes){
                      var id=nodes[0].idPath;
                      $.ajax({
                          url:"${pageContext.request.contextPath}/codeController/selectByIdPath.json",
                          method:"post",
                          data:{"idPath":id},
                          dataType:"json",
                          success:function(d){
                              $("#updateDiv").hide();
                              $("#addDiv").hide();
                              $("#searchDiv").show();
                              var list= d.list;
                              var html='';
                              for(var i=0;i<list.length;i++){
                                  html=html+createHtml(list[i]);
                              }
                              $("#tbody").html(html);
                          }
                      });
                  }else{

                  }
              });
          });
          function createHtml(obj){
              var html='';
              html+='<tr> <td>'+
                      obj.id+
                      '</td><td>'+
                      obj.name+
                      '</td><td>'+
                      obj.parentId+
                      '</td><td>'+
                      obj.idPath+
                      '</td></tr>';
              return html;
          }
          //获取所有选中节点的值
          function GetCheckedAll() {
              var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
              var nodes = treeObj.getCheckedNodes(true);
              var msg = "name--id--pid\n";
              for (var i = 0; i < nodes.length; i++) {
                  msg += nodes[i].name+"--"+nodes[i].id+"--"+nodes[i].pId+"--"+nodes[i].idPath+"\n";
              }
              alert(msg);
          }
      </script>
  </head>
  
  <body>
 <%--  <jsp:include page="/WEB-INF/decorators/header.jsp"/>--%>
   <div style="border: 1px solid mediumseagreen;width: 10%;float: left;margin-right: 20px;">
       <ul id="treeDemo" class="ztree"></ul>
   </div>
   <div style="border: 1px solid mediumseagreen;width: 80%;float: left;">
       <button onclick="GetCheckedAll()">选中的值</button>
       <button id="add">增加</button><button id="delete">删除</button><button id="update">修改</button><button id="search">查询</button>
       <div id="addDiv" style="border: 1px salmon solid;display: none">
           <form id="addFor" action="">
           名称：<input type="text" name="name"/>
                 <input type="hidden" name="parentId" id="parentId"/>
                 <input type="hidden" name="idPath" id="idPath"/>
           <input type="button" id="addBtn" value="增加">
           </form>
       </div>
       <div id="updateDiv" style="border: 1px salmon solid;display: none">
           <form id="updateFor" action="">
               名称：<input type="text" name="name" id="updateName"/>
               <input type="hidden" name="id" id="updateId"/>
               <input type="button" id="updateBtn" value="修改">
           </form>
       </div>
       <div id="searchDiv" style="border: 1px salmon solid;display: none">
           <table style="border: 1px solid gray;">
               <thead>
               <tr>
                   <td>id</td>
                   <td>名称</td>
                   <td>pId</td>
                   <td>idPath</td>
               </tr>
               </thead>
               <tbody id="tbody">

               </tbody>
           </table>
       </div>
   </div>
  <%--<jsp:include page="/WEB-INF/decorators/footer.jsp"/>--%>
  </body>
</html>
